<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="24" >
            <a-form-model-item  label="车辆类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="carTypeName">
              <EBikeTypeDialog v-model="model.carTypeName" :id.sync="model.carTypeId"></EBikeTypeDialog>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="管理人员" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="manageUserId">
              <j-select-user-by-dep store="id" v-model="model.manageUserId" ></j-select-user-by-dep>
            </a-form-model-item>
          </a-col>

          <a-col :span="24" >
            <a-form-model-item  label="绑定网点" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="meshPointName">
              <StoreDialog v-model="model.meshPointName" :id.sync="model.meshPointId"></StoreDialog>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="车牌编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="plate">
              <a-input v-model="model.plate" placeholder="请输入车牌编号"  ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="自编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="customCode">
              <a-input v-model="model.customCode" placeholder="请输入自编号"  ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="中控IMEI码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="carCode">
              <a-input v-model="model.carCode" placeholder="请输入中控IMEI码"  ></a-input>
            </a-form-model-item>
          </a-col>
          
          <a-col :span="24">
            <a-form-model-item label="中控SN码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="phone">
              <a-input v-model="model.phone" placeholder="请输入中控SN码"  ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="车架编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="frameCode">
              <a-input v-model="model.frameCode" placeholder="请输入车架编号"  ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="电机编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="eMotorCode">
              <a-input v-model="model.emotorCode" placeholder="请输入电机编号"  ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="控制器编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ctrlCode">
              <a-input v-model="model.ctrlCode" placeholder="请输入控制器编号"  ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="仪表盘编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="dashboardCode">
              <a-input v-model="model.dashboardCode" placeholder="请输入仪表盘编号"  ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="电池编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="bmsCode">
              <a-input v-model="model.bmsCode" placeholder="请输入电池编号"  ></a-input>
            </a-form-model-item>
          </a-col>

          <!-- <a-col :span="24"> -->
<!--          <a-form-model-item label="省" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="provinceId">
            <a-select v-model="model.provinceId" placeholder="请选择省">
              <a-select-option v-for="province in provinces" :key="province.id" :value="province.id">
                {{ province.name }}
              </a-select-option>
            </a-select>
          </a-form-model-item>-->
          <!-- </a-col> -->

          <a-col :span="24">
            <a-form-model-item label="制造商编码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="manufacturerId">
              <a-input v-model="model.manufacturerId" placeholder="请输入制造商编码"  ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="终端类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="terminalType">
              <a-input v-model="model.terminalType" placeholder="请输入终端类型"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="终端编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="terminalId">
              <a-input v-model="model.terminalId" placeholder="请输入终端类型"  ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="蓝牙识别码" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="blueCode">
              <a-input v-model="model.blueCode" placeholder="请输入蓝牙识别码"  ></a-input>
            </a-form-model-item>
          </a-col>

          <a-col :span="24">
            <a-form-model-item label="蓝牙秘钥" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="blueKey">
              <a-input v-model="model.blueKey" placeholder="请输入蓝牙秘钥"  ></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>

        <ControllerSettings  :carId="model.id" style="width: 800px;" />

        <!--        <a-card title="控制器设置">
                  <a-row :gutter="16">
                    <a-col :span="24">
                      <a-form-model-item label="控制器数据" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="controlJson">
                        <a-textarea
                          v-model="model.controlJson"
                          placeholder="控制器数据"
                          :rows="8"
                          :disabled="true"
                          style="width: 100%; border: 1px solid #d9d9d9; border-radius: 4px; font-size: 14px; color: #333; background-color: #f5f5f5;"
                        />
                      </a-form-model-item>
                    </a-col>
                  </a-row>

                  <a-row :gutter="16">
                    <a-col :span="24">
                      <a-form-model-item label="预估里程" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="mileage">
                        <a-input-number
                          v-model="model.mileage"
                          placeholder="请输入预估里程"
                          style="width: 100%; border: 1px solid #d9d9d9; border-radius: 4px;"
                        />
                      </a-form-model-item>
                    </a-col>
                  </a-row>

                  <a-card title="0xA100">
                    <a-row>
        &lt;!&ndash;          <a-col :span="24">
                    <a-form-model-item label="助力等级" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="assistLevel">
                      <a-input-number
                        v-model="model.assistLevel"
                        placeholder="请输入助力等级"
                        style="width: 100%; border: 1px solid #d9d9d9; border-radius: 4px;"
                      />
                    </a-form-model-item>
                  </a-col>&ndash;&gt;


                      <a-col :span="24">
                        <a-form-model-item label="转把关闭延时" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="assistLevel">
                          <a-select v-model="model.assistLevel" placeholder="请选择转把关闭延时">
                            <a-select-option :value="0">0 秒</a-select-option>
                            <a-select-option :value="1">1 秒</a-select-option>
                            <a-select-option :value="2">3 秒</a-select-option>
                            <a-select-option :value="3">5 秒</a-select-option>
                            <a-select-option :value="4">10 秒</a-select-option>
                            <a-select-option :value="5">15 秒</a-select-option>
                            <a-select-option :value="6">30 秒</a-select-option>
                            <a-select-option :value="7">60 秒</a-select-option>
                          </a-select>
                        </a-form-model-item>
                      </a-col>
                  <a-col :span="24">
                    <a-form-model-item label="电机锁" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="motorLock">
                      <a-switch v-model="model.motorLock" checked-children="上锁" un-checked-children="解锁" />
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="24">
                    <a-form-model-item label="动力禁用" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="powerDisable">
                      <a-switch v-model="model.powerDisable" checked-children="禁用" un-checked-children="启用" />
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="24">
                    <a-form-model-item label="国标速度" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="speed">
                      <a-input-number
                        v-model="model.speed"
                        placeholder="请输入国标速度"
                        style="width: 100%; border: 1px solid #d9d9d9; border-radius: 4px;"
                      />
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="24">
                    <a-form-model-item label="工作模式" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="workModeValue">
                      <a-select v-model="model.workModeValue" placeholder="请选择工作模式">
                        <a-select-option :value="1">混合</a-select-option>
                        <a-select-option :value="2">纯电动</a-select-option>
                        <a-select-option :value="3">纯助力</a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  <a-col :span="24">
                    <a-form-model-item label="启动模式" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="startModeValue">
                      <a-select v-model="model.startModeValue" placeholder="请选择启动模式">
                        <a-select-option :value="0">零启动</a-select-option>
                        <a-select-option :value="1">非零启动</a-select-option>
                      </a-select>
                    </a-form-model-item>
                  </a-col>
                  </a-row>
                </a-card>


                  <a-card title="0xA10E">
                    <a-row>
                      <a-col :span="24">
                        <a-form-model-item label="国标限速" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="speedLimitEnabled">
                          <a-switch v-model="model.speedLimitEnabled" checked-children="开启" un-checked-children="关闭" />
                        </a-form-model-item>
                      </a-col>
                      <a-col :span="24">
                        <a-form-model-item label="联动功能" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="linkageEnabled">
                          <a-switch v-model="model.linkageEnabled" checked-children="开启" un-checked-children="关闭" />
                        </a-form-model-item>
                      </a-col>
                      <a-col :span="24">
                        <a-form-model-item label="EABS" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="eabsEnabled">
                          <a-switch v-model="model.eabsEnabled" checked-children="开启" un-checked-children="关闭" />
                        </a-form-model-item>
                      </a-col>
                      <a-col :span="24">
                        <a-form-model-item label="停车进入P档时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="parkingToPTime">
                          <a-select v-model="model.parkingToPTime" placeholder="请选择停车进入P档时间">
                            <a-select-option :value="0">关闭功能</a-select-option>
                            <a-select-option :value="1">10秒进入P</a-select-option>
                            <a-select-option :value="2">30秒进入P</a-select-option>
                            <a-select-option :value="3">60秒进入P</a-select-option>
                            <a-select-option :value="4">130秒进入P</a-select-option>
                          </a-select>
                        </a-form-model-item>
                      </a-col>
                      <a-col :span="24">
                        <a-form-model-item label="防陡坡" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="slopePreventionEnabled">
                          <a-switch v-model="model.slopePreventionEnabled" checked-children="开启" un-checked-children="关闭" />
                        </a-form-model-item>
                      </a-col>
                      <a-col :span="24">
                        <a-form-model-item label="TCS" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="tcsEnabled">
                          <a-switch v-model="model.tcsEnabled" checked-children="开启" un-checked-children="关闭" />
                        </a-form-model-item>
                      </a-col>
                      <a-col :span="24">
                        <a-form-model-item label="启动档位" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="startGear">
                          <a-select v-model="model.startGear" placeholder="请选择启动档位">
                            <a-select-option :value="0">0</a-select-option>
                            <a-select-option :value="1">1</a-select-option>
                            <a-select-option :value="2">2</a-select-option>
                            <a-select-option :value="3">3</a-select-option>
                          </a-select>
                        </a-form-model-item>
                      </a-col>
                      <a-col :span="24">
                        <a-form-model-item label="软启动等级" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="softStartLevel">
                          <a-input-number v-model="model.softStartLevel" placeholder="请输入软启动等级 (0-31)" :min="0" :max="31" />
                        </a-form-model-item>
                      </a-col>
                    </a-row>
                  </a-card>



                  <a-card title="0xA10F 欠压保护电压设置">
                    <a-row :gutter="16">
                      <a-col :span="24">
                        <a-form-model-item label="欠压保护电压 (0.1V)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="undervoltageProtection">
                          <a-input-number
                            v-model="model.undervoltageProtection"
                            placeholder="请输入欠压保护电压"
                            style="width: 100%; border: 1px solid #d9d9d9; border-radius: 4px;"
                          />
                        </a-form-model-item>
                      </a-col>
                    </a-row>
                  </a-card>


                  <a-card title="0xA113 速度百分比设置">
                    <a-row :gutter="16">
                      <a-col :span="12">
                        <a-form-model-item label="一档速度百分比" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="gear1Percentage">
                          <a-input-number
                            v-model="model.gear1Percentage"
                            placeholder="请输入一档速度百分比"
                            style="width: 100%; border: 1px solid #d9d9d9; border-radius: 4px;"
                          />
                        </a-form-model-item>
                      </a-col>
                      <a-col :span="12">
                        <a-form-model-item label="二档速度百分比" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="gear2Percentage">
                          <a-input-number
                            v-model="model.gear2Percentage"
                            placeholder="请输入二档速度百分比"
                            style="width: 100%; border: 1px solid #d9d9d9; border-radius: 4px;"
                          />
                        </a-form-model-item>
                      </a-col>
                    </a-row>
                  </a-card>

                  <a-row :gutter="16">
                  <a-col :span="10">
                    <a-button type="primary" @click="queryController">查询控制器</a-button>
                  </a-col>
                  <a-col :span="10">
                    <a-button type="primary" @click="setControl">设置控制器</a-button>
                  </a-col>
                  </a-row>

                </a-card>-->
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

  import { httpAction, getAction } from '@/api/manage'
  import { validateDuplicateValue } from '@/utils/util'
  import EBikeTypeDialog from '@/components/rental/dialog/EBikeTypeDialog.vue'
  import StoreDialog from '@/components/rental/dialog/storeDialog.vue'
  import ControllerSettings from './ControllerSettings.vue';
  export default {
    name: 'RentalCarForm',
    components: {
      EBikeTypeDialog,
      StoreDialog,
      ControllerSettings
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data () {
      return {
        model:{

         },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        typelistdata:[],
        confirmLoading: false,
        validatorRules: {
          phone: [
            // { required: true, message: '请输入中控手机号', trigger: 'blur' },
            { pattern: /^\d{12}$/, message: '手机号必须为12位数字', trigger: 'blur' },
          ],
          // carCode:{required: true, message: '请输入车辆码', trigger: 'blur'},
          meshPointName:{required: true, message: '请选择网点', trigger: 'blur'},
          // terminalType:{ validator: this.validateTerminalModel, trigger: 'blur' }
        },
        provinces: [
          { id: '1', name: '北京市' },
          { id: '2', name: '天津市' },
          { id: '3', name: '河北省' },
          { id: '4', name: '山西省' },
          { id: '5', name: '内蒙古自治区' },
          { id: '6', name: '辽宁省' },
          { id: '7', name: '吉林省' },
          { id: '8', name: '黑龙江省' },
          { id: '9', name: '上海市' },
          { id: '10', name: '江苏省' },
          { id: '11', name: '浙江省' },
          { id: '12', name: '安徽省' },
          { id: '13', name: '福建省' },
          { id: '14', name: '江西省' },
          { id: '15', name: '山东省' },
          { id: '16', name: '河南省' },
          { id: '17', name: '湖北省' },
          { id: '18', name: '湖南省' },
          { id: '19', name: '广东省' },
          { id: '20', name: '广西壮族自治区' },
          { id: '21', name: '海南省' },
          { id: '22', name: '重庆市' },
          { id: '23', name: '四川省' },
          { id: '24', name: '贵州省' },
          { id: '25', name: '云南省' },
          { id: '26', name: '西藏自治区' },
          { id: '27', name: '陕西省' },
          { id: '28', name: '甘肃省' },
          { id: '29', name: '青海省' },
          { id: '30', name: '宁夏回族自治区' },
          { id: '31', name: '新疆维吾尔自治区' },
          { id: '32', name: '台湾省' },
          { id: '33', name: '香港特别行政区' },
          { id: '34', name: '澳门特别行政区' },
        ],
        datasslist:[],
        url: {
          add: "/rental/ebike/add",
          edit: "/rental/ebike/edit",
          queryById: "/rental/ebike/queryById",
          chargeMeshPointlist:"/rental/store/list",
          typelist:"/rental/ebike-type/list",
          queryControl:"/equ/queryControl"
        }
      }
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    },
    created () {
       //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
      this.getchargeMeshPointlist();
      this.gettypelist();
    },
    methods: {
      add () {
        this.edit(this.modelDefault);
      },
      edit (record) {
        console.log("edit:", record);
        this.model = Object.assign({}, record);
        this.visible = true;
      },
      validateTerminalModel(rule, value, callback) {
        const byteLength = new Blob([value]).size;
        if (byteLength > 20) {
          callback(new Error('终端型号过长'));
        } else {
          callback();
        }
      },

      queryController() {
        const terminalId = this.model.carCode; // Get terminalId from carCode

        this.confirmLoading = true; // Show loading indicator

        httpAction(this.url.queryControl+`?terminalId=${terminalId}`, {}, 'get')
          .then((res) => {
            if (res.success) {
              this.$message.success("查询控制器成功");
              // Handle the response data (res.result) here.
              // For example, you might update a data property to display the controller information.
            } else {
              this.$message.warning(res.message);
            }
          })
          .catch((error) => {
            this.$message.error("查询控制器失败：" + error);
          })
          .finally(() => {
            this.confirmLoading = false; // Hide loading indicator
          });
      },
      /*gettypelist(){
        let that=this;
        httpAction(this.url.typelist,{pageSize:100,pageNo:1},'get').then((res)=>{
          let datass=[]
          res.result.records.forEach(itme=>{
            datass.push({name:itme.carTypeName,id:itme.id})
          })
          this.typelistdata=datass

        }).finally(() => {

        })
      },*/

      gettypelist(){
        let that=this;
        let data={pageSize:100,pageNo:1}
        getAction(this.url.typelist,data).then((res)=>{
          let datass=[]
          res.result.records.forEach(itme=>{
            datass.push({name:itme.carTypeName,id:itme.id})
          })
          this.typelistdata=datass;
          console.log(datass)
        }).finally(() => {

        })
      },
      getchargeMeshPointlist(){
        let that=this;
        let data={pageSize:100,pageNo:1}
        getAction(this.url.chargeMeshPointlist,data).then((res)=>{
          let datass=[]
          res.result.records.forEach(itme=>{
            datass.push({name:itme.meshPointsName,id:itme.id})
          })
          this.datasslist=datass;
        }).finally(() => {

        })
      },
      submitForm () {
        const that = this;
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
            }else{
              httpurl+=this.url.edit;
               method = 'put';
            }
            httpAction(httpurl,this.model,method).then((res)=>{
              if(res.success){
                that.$message.success(res.message);
                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
            })
          }
         
        })
      },

      setControl () {
        const that = this;
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
            }else{
              httpurl+=this.url.edit;
              method = 'put';
            }
            httpAction(httpurl,this.model,method).then((res)=>{
              if(res.success){

              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
            })
          }

        })
      },
    }
  }
</script>